@import './reset';
@import './row-list';
@import './row';
@import './col';
@import './icon';
/* 1像素解决方案 */
/*
 * 清除1px
 */
/*
 * 清除浮动
 */
/*
 * mobile
 */
/*
 * 1px
 */
/*
 * text
 */
/* 垂直居中 */
/* 水平居中 */
/* 水平垂直居中 */
/* 超出部分出省略号 */
/* 多行文本超出部分省略号 */
.sample_content {
    background-size: 100%;
  }
  .mask {
    transition: all 0.25s ease-in;
    transform: scale(1.5);
  }
  .mask.show {
    transform: scale(1);
  }
  .nav_bg {
    background: linear-gradient(to right, #fd5860, #f64b51);
    color: #fff;
    z-index: 800;
  }
  .nav_switch {
    width: 100%;
  }
  .nav_switch view {
    width: 90%;
    margin: 0 auto;
    height: 2px;
    border-radius: 5px;
    background: #fff;
    transition: all ease 0.3s 0s;
    -moz-transition: all ease 0.3s 0s;
    -webkit-transition: all ease 0.3s 0s;
  }
  .nav_switch view.middle {
    margin: 6px auto;
  }
  .nav_switch view.rotate1 {
    transform: translate(0, 0px) rotate(-45deg);
    -moz-transform: translate(0, 0px) rotate(-45deg);
    -webkit-transform: translate(0, 0px) rotate(-45deg);
    -ms-transform: translate(0, 0px) rotate(-45deg);
  }
  .nav_switch view.rotate2 {
    transform: scale(0, 1);
    -moz-transform: scale(0, 1);
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    margin: 0;
  }
  .nav_switch view.rotate3 {
    transform: translate(0, -4px) rotate(45deg);
    -moz-transform: translate(0, -4px) rotate(45deg);
    -webkit-transform: translate(0, -4px) rotate(45deg);
    -ms-transform: translate(0, -4px) rotate(45deg);
  }
  .nav_content {
    padding-top: 50px;
  }
  .nav_content .ui-row {
    width: 90%;
    margin: 0 auto;
  }
  .nav_content .ui-icon {
    display: block;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 50%;
  }
  .nav_content view {
    padding-top: 10px;
  }
  .nav_content .nav_1 {
    background: #ff8e8e;
    box-shadow: rgba(255, 142, 142, 0.498039) 0px 6px 15px 0;
  }
  .nav_content .nav_1 + view {
    color: #ff8e8e;
  }
  .nav_content .nav_2 {
    background-color: #6ee3c3;
    box-shadow: #abe8d8 0px 6px 15px 0px;
  }
  .nav_content .nav_2 + view {
    color: #6ee3c3;
  }
  .nav_content .nav_3 {
    background-color: #fe9bda;
    box-shadow: #f1d7e7 0px 6px 15px 0px;
  }
  .nav_content .nav_3 + view {
    color: #fe9bda;
  }
  .nav_content .nav_4 {
    background-color: #cda5fd;
    box-shadow: #e7d4fd 0px 6px 15px 0px;
  }
  .nav_content .nav_4 + view {
    color: #cda5fd;
  }
  .nav_content .nav_5 {
    background-color: #f88ca3;
    box-shadow: #fbd9e0 0px 6px 15px 0px;
  }
  .nav_content .nav_5 + view {
    color: #f88ca3;
  }
  .nav_content .nav_6 {
    background-color: #fe8c74;
    box-shadow: #fbd3ca 0px 6px 15px 0px;
  }
  .nav_content .nav_6 + view {
    color: #fe8c74;
  }
  .nav_content .nav_7 {
    background-color: #7ce488;
    box-shadow: #c9f3ce 0px 6px 15px 0px;
  }
  .nav_content .nav_7 + view {
    color: #7ce488;
  }
  .nav_content .nav_8 {
    background-color: #89d7e3;
    box-shadow: rgba(137, 215, 227, 0.498039) 0px 6px 15px 0px;
  }
  .nav_content .nav_8 + view {
    color: #89d7e3;
  }
  .nav_content .nav_9 {
    background-color: #ffaf70;
    box-shadow: rgba(255, 175, 112, 0.498039) 0px 6px 15px;
  }
  .nav_content .nav_9 + view {
    color: #ffaf70;
  }
  .nav_content .nav_10 {
    background-color: #f8a8f9;
    box-shadow: rgba(248, 168, 249, 0.498039) 0px 6px 15px 0px;
  }
  .nav_content .nav_10 + view {
    color: #f8a8f9;
  }
  .nav_content .nav_11 {
    background-color: #ffd43d;
    box-shadow: rgba(255, 212, 61, 0.498039) 0px 6px 15px 0px;
  }
  .nav_content .nav_11 + view {
    color: #ffd43d;
  }
  .nav_content .nav_0 + view {
    color: #ffd43d;
  }
  .nav_content .nav_0 {
    background-color: #ffd43d;
    box-shadow: rgba(255, 212, 61, 0.498039) 0px 6px 15px 0px;
  }
  .box {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    display: flex;
    flex-flow: wrap row;
    justify-content: center;
  }
  .item {
    margin: 30rpx 10rpx;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 150rpx;
    height: 200rpx;
    overflow: hidden;
    position: relative;
    text-align: center;
    font-size: 0.8rem;
  }
  .icon_cenct {
    margin: 0 auto;
  }
  page {
    background-color: #fff;
  
  }
  .all{
    background-color: #fff;
    }
  